<template>
    <div class="bodys">
      <p class="money">商品金额  <span>{{actualPrice.sell_price}}</span><span style="font-size: 12px;margin-right: -3.3vw;">￥</span></p>
      <div  v-if="actualPrice.is_vip == 1" style="width: 100%;height: 10.33vw;overflow:hidden;">
          <div v-if="actualPrice.shipping_fee.is_get == 1">
            <p class="freight">会员立减 <span>￥ {{actualPrice.member_price}}</span></p>
          </div>
        <!-- <p class="vipCard" style="width: 100%;display: inline-block;">

          <span  v-html="actualPrice.member_tip" style="float: left;"></span>
        </p> -->
      </div>
      <div  v-if="actualPrice.is_vip == 0" style="width: 100%;height: 10.33vw;overflow:hidden;
      background:linear-gradient(270deg,rgba(255,236,187,1) 0%,rgba(253,254,205,1) 100%);" @click="goApp">
        <p class="vipCard" style="width: 100%;display: inline-block;">

          <span  v-html="actualPrice.member_tip" style="float: left;"></span>
          <!--<span v-if="actualPrice.is_vip == 0">开通会员<img src="../../assets/img/rectangle.png" alt=""></span>-->
        </p>
      </div>
      <!--<p class="vipCard" v-else>纳品会员卡￥:3,可节省30元 <span>开通会员 <img src="../../assets/img/rectangle.png" alt=""></span></p>-->
      <div v-if="actualPrice.shipping_fee.is_get == 1">
        <p class="freight">运费 <span>￥ {{shipping_fee}}</span></p>
      </div>
      <div v-if="actualPrice.shipping_fee.is_get == 0">
        <p class="freight"><span>￥ {{actualPrice.shipping_fee.tip}}</span></p>
      </div>
      <coupon style="height: 13.33vw;border: none;padding-top: 1vw;" v-if="coupon !== 0"></coupon>
    </div>
</template>

<script>
  import coupon from '../../components/vant/coupon'
  import { Dialog } from 'vant';
    export default {
        name: "productPrice",
      props:['actualPrice','shipping_fee'],
      data(){
        return{
          coupon:0,
        }
      },
      methods:{
        goApp(){
          Dialog.confirm({
            message: '是否前往APP操作？'
          }).then(() => {
            window.location.href="http://www.napin.com/download.html"
          }).catch(() => {
            // on cancel
          });

        }
      },
      components:{
        coupon
      }
    }
</script>

<style scoped lang="scss">
.bodys{
  width:92vw;
  height: auto;
  border-radius: 2.5vw;
  margin: 0px auto;
  background: #fff;
  box-shadow: 1px 0 1px 0px #ccc;
  overflow: hidden;
  .van-cell{
    height: 13.33vw !important;
  }
  .freight{
    width: 100%;
    height: 13.33vw;
    font-size: 15px;
    color: #333;
    line-height: 13.33vw;
    text-indent: 3.3vw;
    border-bottom: 1px solid #f5f5f5;
    span{
      float: right;
      margin-right: 2.5vw;}
  }
    .money{
      width: 100%;
      height: 13.33vw;
      font-size: 15px;
      color: #333;
      line-height: 13.33vw;
      text-indent: 3.3vw;
        span{
          float: right;
          margin-right: 2.5vw;
          color: #FF5230;
        }
    }
  .vipCard{
    width: 100%;
    height: 13.33vw;
    font-size: 13px;
    color: #ff4c50;
    line-height: 10.99vw;
    text-indent: 3.3vw;
      span{
        float: right;
        margin-right: 2.3vw;
          img{
            width: 2.33vw;
            height: 2.67vw;
            display: inline-block;
          }
      }
  }
}
</style>
<style>
</style>
